Dotnet Turkey

[i1 TicTacToe

• Oil Painting Techniques, How to Oil Paint
• Video Guide Covering All Aspect Of Moving To Spain
• Top 10 Practical Strategies For Success In Any Business

Figure 9-1. Tic-tac-toe boards don't have rounded insets!

What we really want here is to be able to keep the behavior (i.e., holding content and firing click events), but to take over the look of it. WPF allows this kind of thing because the intrinsic controls are built to be lookless (i.e., they provide behavior, but the control's user can swap out the look completely). The default look comes from the system-provided template, as described in Chapter 12.

Remember from Chapters 6 and 8 how we used data templates to provide the look of a nonvisual object? We can do the same to a control using a control template—a set of triggers, resources, and most important, elements that provide the look of a control.

To fix our buttons' looks, we'll build ourselves a control template resource. Let's start things off with a simple rectangle (see Example 9-1).

Example 9-1. A minimal control template <!-- let's just try one button for now... -->

<Button Margin="0)0)2,2" Grid.Row="0" Grid.Column="0" Name="cell00"> <Button.Template> <ControlTemplate> <Grid>

<Rectangle /> </Grid> </ControlTemplate> </Button.Template> </Button>

Figure 9-2 shows the results of setting a single button's Template property.

Figure 9-2. Replacing the control template with something less visual than we'd like...

Notice that no vestiges of how the button used to look remain in Figure 9-2. Unfortunately, we can see no vestige of our rectangle, either. The problem is that without a fill explicitly set, the rectangle defaults to no fill, showing the grid's black background. Let's set it to our other favorite Halloween color instead:

<ControlTemplate> <Rectangle Fill="Orange" />

</ControlTemplate>

Now we're getting somewhere, as Figure 9-3 shows.

Figure 9-3. Replacing the button's control template with an orange rectangle (Color Plate 13)

Figure 9-3. Replacing the button's control template with an orange rectangle (Color Plate 13)

Notice how square the corners are now? Also, if you click, you won't get the depression that normally happens with a button (and I don't mean "a sad feeling"). We have taken complete control over the look of the button or, to paraphrase some ancient pop culture, "all your button are belong to us..."

0 0